<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>玩转石板河</title>
    <link href="/css/styleShibanhe.css" type="text/css" rel="stylesheet" />
</head>
<body>
<style>
    .content{min-width: 1300px;overflow-x:auto;}
    .banner{width: 100%;height: 484px;background: url(/img/banner2.png) no-repeat center center;background-size: 1920px 100%;position: relative;}
    .bannerArea{width: 1190px;position: absolute;left: 50%;transform: translateX(-50%);bottom: 60px;text-align: right;z-index: 2;}
    .bannerArea p{font-size: 35px;color: #fff;line-height: 1.4;font-weight: 200;text-transform:uppercase;}
    .nav{width: 100%;height: 48px;background: url(/img/nav.png) no-repeat center center;background-size: 1920px 48px;}
    .nav p{width: 1260px;margin: 0 auto;display: flex;align-items: center;height: 48px;color: #000000;}
    .nav p img{margin-right: 10px;}

    .main{width: 100%;background: url(/img/back3.png) no-repeat;background-size: 1920px 1434px;background-position: center bottom;padding-top: 1px;}
    .title{height: 81px;display: block;margin: 65px auto 20px;}
    .tabBox{height: 35px;width: 1260px;margin:0 auto 55px;}
    .tabUl{display: flex;justify-content: space-around;}
    .tabUl li{width: 186px;height: 35px;line-height: 35px;color: #50ac53;text-align: center;background: url(/img/active2.png) no-repeat;cursor: pointer;font-size: 16px;}
    .tabUl li.active,.tabUl li:hover{background: url(/img/active1.png) no-repeat;color: #fff;}

    .spot{width: 1240px;overflow: hidden;margin: 0 auto 48px;padding-left: 20px;}
    .spotBox{width: 380px;height: 450px;float: left;position: relative;margin-right: 40px;border:1px solid #ccc}
    .spotImg{width: 87%;height: 70%;position: relative;top:20px;left:25px}
    .spotBox:nth-of-type(1){margin-bottom: 40px;}
    .spotBox:nth-of-type(2){margin-bottom: 40px;}
    .spotBox:nth-of-type(3){margin-bottom: 40px;}
    .spotBox:nth-of-type(3n){margin-right: 0;}
    .spotBox p:nth-of-type(3){height: 42px;position: absolute;left: 210px;bottom: 22px;line-height: 54px;background:red;width: 36%;font-size: 16px;color: #fff;display: flex;align-items: center;border-radius:12px;}
    .spotBox p:nth-of-type(3) a{margin-left: 30px;color: white}
    .spotBox p:nth-of-type(2){color: red;position: absolute;left:17px;bottom: 25px;font-size:25px;}
    .spotBox p:nth-of-type(2) span{font-size:14px;}
    .spotBox p:nth-of-type(2) .price{font-size:25px;}
    .spotBox p:nth-of-type(2) .originalPrice{color:#808080;text-decoration:line-through;}
    .spotBox p:nth-of-type(1){color: #808080;position: absolute;left:24px;bottom: 70px;font-size:17px;}

    .language{position: absolute;top:30px;right: 30px;font-size: 12px;z-index: 222}
    .language span{margin: 0 3px;color: #ccc;}
    .language .cur{color: #fff;}
    .nav a{color: black}
</style>
<div class="content">
    <div class="banner">
        <div class="language">
            <span class="cur">中文</span>
            <span>English</span>
            <span>日本語</span>
            <span>한국어</span>
        </div>
        <div class="head">
            <div class="headLeft cur">
                <a href="/">网站首页</a>
            </div>
            <div class="headLeft">
                <a href="/walking">走进景区</a>
            </div>
            <div class="headLeft">
                <a href="/impression">印象景区</a>
            </div>
            <div class="headLeft">
                <a href="/play">玩转景区</a>
            </div>
            <img class="logo" src="/img/logo.jpg" style="width:180px;height:172px"/>
            <div class="headRight">
                <a href="/shopping">景区周边</a>
            </div>
            <div class="headRight">
                <a href="/dynamic">景区动态</a>
            </div>
            <div class="headRight">
                <a href="/strategy">旅游攻略</a>
            </div>
            <div class="headRight">
                <a href="/service">客户服务</a>
            </div>
        </div>
        <div class="bannerArea">
            <p>> 玩转石板河</p>
            <p>Playing around SHI BAN HE</p>
        </div>
    </div>

    <div class="nav">
        <p><img src="/img/location.png"/>您的位置：<a href="/">网站首页&nbsp;></a>&nbsp;<a href="/play">玩转石板河&nbsp;></a>&nbsp;<a href="#" class="siteChange">娱</a></p>
    </div>

    <div class="main">
        <img class="title" src="/img/title3.png" />
        <div class="tabBox">
            <ul class="tabUl">
                <li class="active">吃</li>
                <li>住</li>
                <li>行</li>
                <li>游</li>
                <li>购</li>
                <li>娱</li>
            </ul>
        </div>

        <div class="spot">
            <div class="spotBox">
                <img class="spotImg" src="/img/shopping1.png" />
                <p>汉鑫誉大酒店</p>
                <p><span class="price">￥</span>68.00&nbsp;&nbsp;<span class="originalPrice">￥</span><span class="originalPrice">88</span></p>
                <p><a href="/shoppingDetail">立即购买</a></p>
            </div>
            <div class="spotBox">
                <img class="spotImg" src="/img/shopping2.png" />
                <p>碧水山庄餐饮</p>
                <p><span class="price">￥</span>99.00&nbsp;&nbsp;<span class="originalPrice">￥</span><span class="originalPrice">119</span></p>
                <p><a href="/shoppingDetail">立即购买</a></p>
            </div>
        </div>

        <div class="box">
            <div id="pagination" class="page fl"></div>
        </div>

        <div class="footer">
            <div class="footerTop">
                <span id="link">友情链接：</span>
                <!--<a href="#"><img src="/img/icon2.png" /></a>-->
            </div>
            <ul class="footUl">
                <li><a href="/">网站首页</a></li>
                <li><a href="/walking">走进石板河</a></li>
                <li><a href="/impression">印象石板河</a></li>
                <li><a href="/play">玩转石板河</a></li>
                <li><a href="/surrounding">景区导览</a></li>
                <li><a href="/dynamic">景区动态</a></li>
                <li><a href="/strategy">旅游攻略</a></li>
                <li><a href="/service.html">客户服务</a></li>
            </ul>
            <p><span id="companyName">安徽省石板河旅游发展有限公司</span>　版权所有　 <span id="copyright">Copyright © 2020 All Right Reserve　</span></p>
            <p>免责申明　皖公网安备 <span id="recordNo">34018102340321号</span></p>
            <p>技术支持：<span id="technicalSupport">徽章纵视</span></p>
        </div>
    </div>
</div>
<script src="/js/jquery.min.js"></script>
<script src="/js/jquery.pagination.js"></script>
<script>
    function GetRequest() {
        var url = location.search; //获取url中"?"符后的字串
        var theRequest = new Object();
        if (url.indexOf("?") != -1) {
            var str = url.substr(1);
            strs = str.split("&");
            for(var i = 0; i < strs.length; i ++) {
                theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
            }
        }
        return theRequest;
    }


    $(document).ready(function(){
        var a=GetRequest();

        $(".tabUl li").click(function(){
            $(".tabUl li").removeClass('active');
            $(this).addClass('active');

            var index = $(this).index()+1;
            var arr = ['吃','住','行','游','购','娱'];
            $(".siteChange").html(arr[index-1]);

            var pageCount=1;
            var totalData=1;
            Init(0)

            function Init(pageIndex){
                $.ajax({
                    type : "POST",
                    url :  "/scenery/article/sceneryArticleList",
                    data : {articleType:10,palyType:index,articleTitle:'',offset:pageIndex,limit:3},
                    async : false,
                    success : function(data) {
                        if(data != null && data != '') {
                            $("#pagination").append("<span>共"+data.total+"条信息</span>")
                            totalData=data.total
                            if(parseInt(data.total)>=6){
                                pageCount=Math.ceil(data.total/6);
                            }else{
                                pageCount=1;
                            }
                            var div="";
                            for (var i=0;i<data.rows.length;i++){
                                div+="<div class=\"spotBox\">"
                                $.ajax({
                                    type : "POST",
                                    url :  "/common/sysFile/list",
                                    data : {attachId:data.rows[i].attachId},
                                    async : false,
                                    success : function(data) {
                                        if(data != null && data != '') {
                                            div+="<img class='spotImg' src='"+data[0].fileUrl+"'/>"
                                        }
                                    }
                                });
                                div+="<p>"+data.rows[i].articleTitle+"</p>"
                                div+="<p><span class=\"price\">￥</span>"+data.rows[i].price+"&nbsp;&nbsp;<span class=\"originalPrice\">￥</span><span class=\"originalPrice\">"+data.rows[i].originalPrice+"</span></p>"
                                div+="<p><a href=\"/shoppingDetail?id="+data.rows[i].id+"\">立即购买</a></p></div>"
                            }
                            $('.spot').html(div);
                        }
                    }
                });
            }


            function pageselectCallback(page_id, jq) {
                Init((page_id.getCurrent()-1)*6)
            }
            $("#pagination").pagination( {
                callback: pageselectCallback,//PageCallback() 为翻页调用次函数。
                pageCount: pageCount, //总页数
                totalData: totalData,
                items_per_page: 6, //每页的数据个数
                coping: true,
                homePage: '首页',
                endPage: '末页',
                prev_text: " 上一页",
                next_text: "下一页 ",
            });
        })
        $(".tabUl li").eq(0).click();


        $.ajax({
            type : "POST",
            url :  "/system/link/linkList",
            async : false,
            success : function(data) {
                if(data != null && data != '') {
                    if(data.code==0){
                        var div=""
                        for (var i=0;i<data.linkList.length;i++){
                            div+="<a href='"+data.linkList[i].linkUrl+"'>";
                            $.ajax({
                                type : "POST",
                                url :  "/common/sysFile/list",
                                data : {attachId:data.linkList[i].attachId},
                                async : false,
                                success : function(data) {
                                    if(data != null && data != '') {
                                        div+="<img src='"+data[0].fileUrl+"' /></a>"
                                    }
                                }
                            });
                        }
                        $("#link").after(div)
                    }
                }
            }
        });


        $.ajax({
            type : "GET",
            url :  "/sys/sysSet/getSet",
            data : {type:''},
            async : false,
            success : function(data) {
                if(data != null && data != '') {
                    if(data.code==0){
                        var setDOList=data.setDOList
                        for (var i=0;i<setDOList.length;i++){
                            $("#"+setDOList[i].setCode).text(setDOList[i].setValue)
                        }
                    }
                }
            }
        });
    })




</script>
</body>
</html>

